<template>
  <div class="aboutus">
    <!-- 版心 -->
    <div class="content">
      <div>
        <!-- 第一层 -->
        <div>
          <router-link to="/">首页</router-link> -
          <span style="color: #fbb957">关于我们</span>
        </div>
        <!-- 第二层内容 -->
        <div class="f2">
          <!-- 左边导航菜单 -->
          <div class="nav">
            <p>关于众信</p>
            <el-menu
              :default-active="activeIndex"
              class="el-menu-demo"
              @select="handleSelect"
            >
              <el-menu-item @click="$router.push('/aboutus/dongtai')" index="1"
                >众信动态</el-menu-item
              >
              <el-menu-item @click="$router.push('/aboutus/hezuo')" index="2"
                >商务合作</el-menu-item
              >
              <el-menu-item index="3" @click="$router.push('/aboutus/pinpai')"
                >集团全品牌</el-menu-item
              >
              <el-menu-item @click="$router.push('/aboutus/wangdian')" index="4"
                >营业网点</el-menu-item
              >
            </el-menu>
          </div>
          <!-- 右边内容 -->
          <div class="right">
            <router-view />
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      activeIndex: "1",
      now: 1,
    };
  },
};
</script>

<style lang="scss" scoped>
a {
  text-decoration: none;
}
.aboutus {
  background-color: #f7f7f7;
  padding-top: 20px;
}
.content {
  width: 1142px;
  margin: 0 auto;
}
.f2 {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
}
.nav {
  margin-top: 10px;
  > p {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 5px;
    color: #333;
    padding-left: 17px;
    border-left: 4px solid #fbb957;
  }
}
.el-menu-demo {
  width: 168px;
  background-color: white;
  border: none;
  // text-align: center;

  > .el-menu-item {
    height: 34px;
    line-height: 34px;
    margin-bottom: 3px;

    &:hover {
      background-color: #fbb957;
      color: white;
    }
  }

  > .is-active {
    background-color: #fbb957;
    color: white;
  }
}
.right {
  width: 850px;
  background-color: #fff;
  // border: 1px solid red;
  padding: 0 50px;
  border-radius: 10px;
}
</style>
